import { init, h } from 'snabbdom'

// 1.导入模块
import { styleModule } from 'snabbdom/build/modules/style'
import { eventListenersModule } from 'snabbdom/build/modules/eventlisteners'
// 2. init()注册模块(为patch模块添加对应能力)
const patch = init([
  styleModule,
  eventListenersModule
])

//3. 使用模块 {}为模块功能等,多个节点使用[]
let vNode = h('div#box', {
  style:{
    height: '100px',
    width: '100px',
    backgroundColor: 'green'
  }
}, [
  h('h1#title', 
  {
    style: {
      color: 'pink'
    }
  },
  '这是标题内容'),
  h('h2#title2',{
    style:{
      color: '#66ccff'
    },
    on: {
      click(){
        console.log('点击弹出xinneirong')
      }
    }
  },
  '这是点击事件'
  )
])

//4.渲染
const dom = document.querySelector('#app')

patch(dom, vNode)